<template>
	<view class="page">
		<view style="font-weight: 500;font-size: 28rpx;color: #666666;">
			请描述您的问题或建议：
		</view>
		<view style="background-color: #fff;border-radius: 10rpx;margin: 30rpx 0pt;">
			<textarea v-model="form.content" style="padding: 20rpx;" placeholder="请输入…"></textarea>
		</view>
		<view class="form" style="padding: 10rpx 20rpx;">
			<view class="inp">
				<view class="left"><text>手机号码：</text></view>
				<view class="right">
					 <input type="number" class="input" placeholder="请输入您的手机号" v-model="form.mobile"  />
				</view>
			</view>
		</view>
		
		<view class="fixed_footer" >
			<view class="history" @click="tourl('/pages/my/message/messageList?type='+type)">
				<image src="https://jiejinda.oss-cn-beijing.aliyuncs.com/e8c747536720f91e4c6002124bd6c315aadc8dbb9642a36871d4d19fcc129986.png" mode=""></image>
				<text>反馈记录</text>
			</view>
			<view class="but" @click="up">
				确认反馈
			</view>
		</view> 
	</view>
</template>

<script>
	import {opinioncreateAPI} from "@/api/user.js"
	export default {
		data() {
			return {
				form:{
					content:"",
					mobile:""
				},
				type:1//1意见2.合作
				
			}
		},
		onLoad(e) {
			if(e.type){
				this.type=e.type
				uni.setNavigationBarTitle({
					title:this.type==1?'意见建议':'商务合作'
				})
			}
			
		},
		methods: {
			 
			up(){
				opinioncreateAPI(
				this.type,{
					phone:this.form.mobile,
					content:this.form.content
				}).then(res=>{
					uni.showToast({
						title:"提交成功"
					})
					setTimeout(()=>{
						uni.navigateBack()
					},1000)
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
.page{
	padding: 30rpx;
	min-height: 100vh;
	background-color: #F8F8F8;
	  
}
.form{
	background-color: #fff;
	border-radius: 20rpx;
	padding: 20rpx;
	 
	.inp{
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 25rpx 0;
		 
		.left{
			display: flex;
			align-items: center;
			image{
				width: 45rpx;
			}
			>text{
				font-weight: 500;
				font-size: 28rpx;
				color: #333333;
			}
		}
		
		input{
			text-align: right;
		}
		.right{
			display: flex;
			align-items: center;
			>image{
				width: 40rpx;
			}
		}
		.datetime{
			display: flex;
			align-items: center;
			text{
				color: #7C8191;
			}
			image{
				width: 35rpx;
			}
		}
		.textarea{
			width: 100%;
			box-sizing: border-box;
			background-color: #F4F6FA;
			border-radius: 20rpx;
			padding: 20rpx;
			margin-top: 40rpx;
			textarea{
				width: 100%;
				height: 40rpx;
			}
		}
	}
}

.fixed_footer{
	background-color: #fff;
	width: 100%;
	height: 110rpx;
	position: fixed;
	bottom: constant(safe-area-inset-bottom);
	bottom: env(safe-area-inset-bottom);
	left: 0;
	display: flex;
	align-items: center;
	border-top: 1px solid #e6e6e6;
	
	.history{
		width: 190rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		image{
			width: 48rpx;
			height: 48rpx;
		}
		text{
			font-weight: 500;
			font-size: 24rpx;
			color: #999999;
			line-height: 28rpx;
		}
	}
	.but {
		flex: 1;
		background-color: $uni-color-primary;
		border-radius: 28px;
		font-size: 30rpx;
		line-height: 90rpx;
		font-weight: 400;
		text-align: center;
		color: #fff;
	}
} 
</style>
